//绑定model
//实时改变：将markdown实时转化为html
<template>
  <div id="mark-note">
    <mavon-editor
      v-model="content"
      ref="md"
      @change="change"
      style="min-height: 550px; width: 100%"
    />
  </div>
</template>
 
 
<script>
import { mavonEditor } from "mavon-editor";
import "mavon-editor/dist/css/index.css";

export default {
  // 注册
  components: {
    mavonEditor,
  },

  data() {
    return {
      content: "", // 输入的markdown
      html: "", // 及时转的html
    };
  },

  methods: {
    // 所有操作都会被解析重新渲染
    change(value, render) {
      // render 为 markdown 解析后的结果[html]
      this.html = render;
    },
  },
};
</script>